<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>首页</title>
    <link rel="stylesheet" href="/static/common/css/reset.css">
    <link rel="stylesheet" href="/static/common/css/swiper_2.7.css">
    <link rel="stylesheet" href="/static/common/css/header.css">
    <link rel="stylesheet" href="/static/common/css/footer.css">
    <link rel="stylesheet" href="/static/css/index/style.css">
    <link rel="stylesheet" href="/static/common/css/common.css">

</head>

<body>
    <!-- 头部部分 -->
    <div id="header"></div>
    <!-- 内容区域 -->
    <div class="index-main">
        <div class="clienW">

        </div>
        <!-- gif车图 -->
        <img class="bd_gif" src="../static/images/index/index_bd.gif" alt="">
        <div class="box-dw">
            <!-- 积分商品ani -->
            <div class="ani-jf-box">
                <a href="javascript:;">
                    <div class="ani-jf1">
                    </div>
                </a>
            </div>

            <!-- 投教基地联盟 -->

            <div class="ani-jd-box">
                <a href="javascript:;">
                    <div class="ani-jd1">

                    </div>
                </a>
            </div>

            <!-- 龙现东海 -->

            <div class="ani-lx-box">
                <a href="javascript:;">
                    <div class="ani-lx1">

                    </div>
                </a>
            </div>

            <!-- 网络课程 -->
            <div class="ani-wl-box">
                <a href="javascript:;">
                    <div class="ani-wl1">

                    </div>
                </a>
            </div>



            <!-- 未来投资家 -->
            <div class="ani-tzj-box">
                <a href="javascript:;">
                    <div class="ani-tzj1">

                    </div>
                </a>
            </div>


            <!-- 投教动态 -->
            <div class="ani-dt-box">
                <a href="javascript:;">
                    <div class="ani-dt1">

                    </div>
                </a>
            </div>

            <!-- 投资者之家 -->
            <div class="ani-tzz-box">
                <a href="javascript:;">
                    <div class="ani-tzz1">

                    </div>
                </a>
            </div>


            <!-- 期货学院 -->
            <div class="ani-qh-box">
                <a href="javascript:;">
                    <div class="ani-qh1">

                    </div>
                </a>
            </div>



            <!-- 教育展示 -->
            <div class="ani-zs-box">
                <a href="javascript:;">
                    <div class="ani-zs1">

                    </div>
                </a>
            </div>
        </div>
    </div>

    <!--放一个id为footer的div,把footer.html加载到这块-->
    <footer>
        <div class="footers">
            <!-- 背景图部分 -->
            <div class="box-footer">
                <div class="box-main-footer">
                    <div class="left-txt">
                        <p>累加访问量:<span>19,502,812</span>次</p>
                        <p><img src="../static//images/footer/icon1.png" alt=""> <span>95531 / 400 8888 588</span></p>
                        <p><img src="../static//images/footer/icon2.png" alt=""> <span>service@longone.com</span></p>
                        <p><img src="../static//images/footer/icon3.png" alt=""> <span>021-50588876</span></p>
                    </div>
                    <div class="right-txt">
                        <span>关注我们</span>
                        <img src="../static//images/footer/wx.png" alt="">
                    </div>
                </div>
                <div class="box-bottom">
                    <div class="box-bottom-content">
                        <p class="left-p">版权声明 中国证监会投资者保护热线：12386</p>
                        <p class="right-p">网站备案号 Copyright @ 2014 DONGHAI SECURITIES All Rights Reserved.
                            苏ICP备13006468号-1
                        </p>
                    </div>
                </div>
            </div>
        </div>

    </footer>
    <!-- 底部部分 -->
</body>
<script src="/static/common/js/jquery-1.11.3.js"></script>
<!-- 加载头尾 -->

<script src="/static/common/js/load.js"></script>
<script src="/static/common/js/swiper_2.7.js"></script>
<script>

    //页面初始化和放大缩小窗口监听高度变化
    var h = $('.index-main').height();
    $('.bd_gif').height(h) + 'px'
    $(window).resize(function () {
        $('.bd_gif').height(h) + 'px'
    })


    // 积分部分的选中效果

    $('.ani-jf-box').mouseenter(function () {

        $('.ani-jf1').css({ animationName: 'ani-jf1', "animation-play-state": 'running' })
        $('.ani-jf1').show()
        $('.ani-jf1').removeClass('ani-jf2')
    })
    $('.ani-jf-box').mouseleave(function () {
        $('.ani-jf1').css({ animationName: 'ani-jf2', "animation-play-state": 'running' })
        $('.ani-jf1').addClass('ani-jf2')
        $('.ani-jf1').on('animationend', function () {
            // 这是
            $('.ani-jf2').hide()
        });
    })

    // 投教基地联盟 


    $('.ani-jd-box').mouseenter(function () {

        $('.ani-jd1').css({ animationName: 'ani-jd1', "animation-play-state": 'running' })
        $('.ani-jd1').show()
        $('.ani-jd1').removeClass('ani-jd2')
    })
    $('.ani-jd-box').mouseleave(function () {
        $('.ani-jd1').css({ animationName: 'ani-jd2', "animation-play-state": 'running' })
        $('.ani-jd1').addClass('ani-jd2')
        $('.ani-jd1').on('animationend', function () {
            // 这是
            $('.ani-jd2').hide()
        });
    })



    //龙现东海


    $('.ani-lx-box').mouseenter(function () {

        $('.ani-lx1').css({ animationName: 'ani-lx1', "animation-play-state": 'running' })
        $('.ani-lx1').show()
        $('.ani-lx1').removeClass('ani-lx2')
    })
    $('.ani-lx-box').mouseleave(function () {
        $('.ani-lx1').css({ animationName: 'ani-lx2', "animation-play-state": 'running' })
        $('.ani-lx1').addClass('ani-lx2')
        $('.ani-lx1').on('animationend', function () {
            // 这是
            $('.ani-lx2').hide()
        });
    })



    // 网络课程




    $('.ani-wl-box').mouseenter(function () {

        $('.ani-wl1').css({ animationName: 'ani-wl1', "animation-play-state": 'running' })
        $('.ani-wl1').show()
        $('.ani-wl1').removeClass('ani-wl2')
    })
    $('.ani-wl-box').mouseleave(function () {
        $('.ani-wl1').css({ animationName: 'ani-wl2', "animation-play-state": 'running' })
        $('.ani-wl1').addClass('ani-wl2')
        $('.ani-wl1').on('animationend', function () {
            // 这是
            $('.ani-wl2').hide()
        });
    })



    // 未来投资家




    $('.ani-tzj-box').mouseenter(function () {

        $('.ani-tzj1').css({ animationName: 'ani-tzj1', "animation-play-state": 'running' })
        $('.ani-tzj1').show()
        $('.ani-tzj1').removeClass('ani-tzj2')
    })
    $('.ani-tzj-box').mouseleave(function () {
        $('.ani-tzj1').css({ animationName: 'ani-tzj2', "animation-play-state": 'running' })
        $('.ani-tzj1').addClass('ani-tzj2')
        $('.ani-tzj1').on('animationend', function () {
            // 这是
            $('.ani-tzj2').hide()
        });
    })



    // 投教动态




    $('.ani-dt-box').mouseenter(function () {

        $('.ani-dt1').css({ animationName: 'ani-dt1', "animation-play-state": 'running' })
        $('.ani-dt1').show()
        $('.ani-dt1').removeClass('ani-dt2')
    })
    $('.ani-dt-box').mouseleave(function () {
        $('.ani-dt1').css({ animationName: 'ani-dt2', "animation-play-state": 'running' })
        $('.ani-dt1').addClass('ani-dt2')
        $('.ani-dt1').on('animationend', function () {
            // 这是
            $('.ani-dt2').hide()
        });
    })




    // 投资者之家




    $('.ani-tzz-box').mouseenter(function () {

        $('.ani-tzz1').css({ animationName: 'ani-tzz1', "animation-play-state": 'running' })
        $('.ani-tzz1').show()
        $('.ani-tzz1').removeClass('ani-tzz2')
    })
    $('.ani-tzz-box').mouseleave(function () {
        $('.ani-tzz1').css({ animationName: 'ani-tzz2', "animation-play-state": 'running' })
        $('.ani-tzz1').addClass('ani-tzz2')
        $('.ani-tzz1').on('animationend', function () {
            // 这是
            $('.ani-tzz2').hide()
        });
    })


    // 期货学院




    $('.ani-qh-box').mouseenter(function () {

        $('.ani-qh1').css({ animationName: 'ani-qh1', "animation-play-state": 'running' })
        $('.ani-qh1').show()
        $('.ani-qh1').removeClass('ani-qh2')
    })
    $('.ani-qh-box').mouseleave(function () {
        $('.ani-qh1').css({ animationName: 'ani-qh2', "animation-play-state": 'running' })
        $('.ani-qh1').addClass('ani-qh2')
        $('.ani-qh1').on('animationend', function () {
            // 这是
            $('.ani-qh2').hide()
        });
    })


    // 教育展示




    $('.ani-zs-box').mouseenter(function () {

        $('.ani-zs1').css({ animationName: 'ani-zs1', "animation-play-state": 'running' })
        $('.ani-zs1').show()
        $('.ani-zs1').removeClass('ani-zs2')
    })
    $('.ani-zs-box').mouseleave(function () {
        $('.ani-zs1').css({ animationName: 'ani-zs2', "animation-play-state": 'running' })
        $('.ani-zs1').addClass('ani-zs2')
        $('.ani-zs1').on('animationend', function () {
            // 这是
            $('.ani-zs2').hide()
        });
    })
</script>

</html>